﻿Ext.onReady(function() {
    Ext.define('Category', {
        extend: 'Ext.data.Model',
        fields: ['id', 'name', 'number']
    });
    
    var categoryStore = Ext.create('Ext.data.Store', {
        //storeId: 'categoryStore',
        model: 'Category',
        /*data: {"categories":[
            {"id":"1", "name":"Linux", "number":"0"},
            {"id":"2", "name":"FreeBSD", "number":"0"},
            {"id":"3", "name":"PHP", "number":"1"}
        ]},*/
        proxy: {
            type: 'ajax',
            url: 'http://localhost/myblog/index.php/admin/category',
            reader: {
                type: 'json',
                root: 'categories'
            }
        },
        autoLoad: true
    });
    
    var win = Ext.create('widget.window', {
        title: 'MyBlog后台管理平台',
        closable: false,
        width: 600,
        height: 400,
        layout: 'border',
        bodyStyle: 'padding: 5px',
        maximized: true,
        items: [{
            region: 'west',
            xtype: 'panel',
            title: '功能导航',
            width: 200,
            split: true,
            collapsible: true,
            floatable: false,
            layout: {
                type: 'vbox',
                align: 'stretch',
                padding: 5
            },
            items: [{
                xtype: 'button',
                text: '分类管理',
                handler: function() {                    
                    var tabpanel_container = Ext.getCmp('tabpanel-region-container');
                    var category_tab = Ext.getCmp('category-tab');
                    if(category_tab) {
                        tabpanel_container.setActiveTab(category_tab);
                    }
                    else {
                        category_tab = tabpanel_container.add({
                           title: 'Category',
                           id: 'category-tab',
                           closable: true,
                        });
                        //alert(categoryStore.getCount());
                        var categoryForm = Ext.create('Ext.form.Panel', {
                            title: 'Category Form',
                            bodyPadding: 5,
                            //width: 350,
                            url: 'http://localhost/myblog/index.php/admin/category/add',
                            layout: 'anchor',
                            defaults: {
                                anchor: '100%'
                            },
                            defaultType: 'textfield',
                            items: [{
                                fieldLabel: 'Category',
                                name: 'category',
                                allowBlank: false
                            }],
                            buttons: [{
                                text: 'Rest',
                                handler: function() {
                                    this.up('form').getForm().reset();
                                }
                            },{
                                text: 'Submit',
                                formBind: true,
                                disabled: true,
                                handler: function() {
                                    var form = this.up('form').getForm();
                                    if(form.isValid()) {
                                        form.submit({
                                           success: function(form, action) {
                                            //Ext.Msg.alert('Success', action.result.msg);
                                            form.reset();
                                            categoryStore.load();
                                            //category_grid.doLayout();
                                           },
                                           failure: function(form, action) {
                                            Ext.Msg.alert('Failed', action.result.msg);
                                           }
                                        });
                                    }
                                }
                            }]
                        });
                        category_tab.add(categoryForm);
                        
                        var category_grid = Ext.create('Ext.grid.Panel', {
                            title: 'Category List',
                            store: categoryStore,
                            dockedItems: [{
                                xtype: 'toolbar',
                                items: [{
                                    //iconCls: 'icon-delete',
                                    text: 'Delete',
                                    scope: this,
                                    handler: function() {
                                        var selection = category_grid.getSelectionModel().getSelection()[0];
                                        if(selection) {
                                            alert(selection.get('name'));
                                        }
                                        else {
                                            Ext.Msg.alert("提示", "请选择要删除的分类");
                                        }
                                    }
                                }]
                            }],
                            columns: [
                                {header: 'ID', dataIndex: 'id', sortable: false},
                                {header: 'Name', dataIndex: 'name', flex: 1},
                                {header: 'Number', dataIndex: 'number'}
                            ],
                        });
                        category_tab.add(category_grid);
                        
                        tabpanel_container.setActiveTab(category_tab);
                    }
                }
            },{
                xtype: 'button',
                text: '链接管理',
                handler: function() {
                    var tabpanel_container = Ext.getCmp('tabpanel-region-container');
                    var link_tab = Ext.getCmp('link-tab');
                    if(link_tab) {
                        tabpanel_container.setActiveTab(link_tab);
                    }
                    else {
                        link_tab = tabpanel_container.add({
                            title: 'Link',
                            id: 'link-tab',
                            closable: true,
                            html: 'Link'
                        });
                        tabpanel_container.setActiveTab(link_tab);
                    }
                }
            },{
                xtype: 'button',
                text: '文章管理',
                handler: function() {
                    var tabpanel_container = Ext.getCmp('tabpanel-region-container');
                    var post_tab = Ext.getCmp('post-tab');
                    if(post_tab) {
                        tabpanel_container.setActiveTab(post_tab);
                    }
                    else {
                        post_tab = tabpanel_container.add({
                            title: 'Post',
                            id: 'post-tab',
                            closable: true,
                            html: 'Post'
                        });
                        tabpanel_container.setActiveTab(post_tab);
                    }
                }
            },{
                xtype: 'button',
                text: '注销登陆',
                handler: function() {
                    Ext.Msg.alert('Handler', 'Logout');
                }
            }]
        },{
            region: 'center',
            xtype: 'tabpanel',
            id: 'tabpanel-region-container'
        }]
    });
    win.show();
});